doctype html
html
  head
    meta(charset='utf-8')
    title 二维码登录界面
    meta(name='viewport', content='width=device-width, initial-scale=1.0')
    link(rel='stylesheet', type='text/css', href='/assets/login/bootstrap/css/bootstrap.min.css')
    link(rel='stylesheet', type='text/css', href='/assets/login/font-awesome/css/font-awesome.min.css')
    style.
      body{
      font-family: 'microsoft yahei',Arial,sans-serif;
      background-color: #222;
      }
      .redborder {
      border:2px solid #f96145;
      border-radius:2px;
      }
      .row {
      padding: 20px 0px;
      }
      .bigicon {
      font-size: 97px;
      color: #f08000;
      }
      .loginpanel {
      text-align: center;
      width: 300px;
      border-radius: 0.5rem;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 10px auto;
      background-color: #555;
      padding: 20px;
      }
      input {
      width: 100%;
      margin-bottom: 17px;
      padding: 15px;
      background-color: #ECF4F4;
      border-radius: 2px;
      border: none;
      }
      h2 {
      margin-bottom: 20px;
      font-weight: normal;
      color: #EFEFEF;
      }
      .btn {
      border-radius: 2px;
      padding: 10px;
      }
      .btn span {
      font-size: 27px;
      color: white;
      }
      .buttonwrapper{
      position:relative;
      overflow:hidden;
      height:50px;
      }
      .lockbutton {
      font-size: 27px;
      color: #f96145;
      padding: 10px;
      width:100%;
      position:absolute;
      top:0;
      left:0;
      }
      .loginbutton {
      background-color: #f08000;
      width: 100%;
      -webkit-border-top-right-radius: 0;
      -webkit-border-bottom-right-radius: 0;
      -moz-border-radius-topright: 0;
      -moz-border-radius-bottomright: 0;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      left: -260px;
      position:absolute;
      top:0;
      }
    script(type='text/javascript', src='/assets/login/js/jquery-1.10.2.min.js')
    script(type='text/javascript', src='/assets/login/bootstrap/js/bootstrap.min.js')
  body
    // Interactive Login - START
    .container-fluid
      .row
        .loginpanel
          img(src='')
    script(type='text/javascript').
      function check_values() {
      if ($("#username").val().length != 0 && $("#password").val().length != 0) {
      $("#loginbtn").animate({ left: '0' , duration: 'slow'});;
      $("#lockbtn").animate({ left: '260px' , duration: 'slow'});;
      }
      }
      $("#loginbtn").click(function(){
      $('#loading').removeClass('hidden');
      //这里书写登录相关后台处理，例如: Ajax请求用户名和密码验证
      });
    // Interactive Login - END
